﻿<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="NewDetail.ascx.cs" Inherits="FreshCms.BackEnd.Controls.New.NewDetail" %>
<%@ Register assembly="CKEditor.NET" namespace="CKEditor.NET" tagprefix="CKEditor" %>

<script src="/BackEnd/js/jquery.uploadify.js" type="text/javascript"></script>
<script src="/BackEnd/js/ckeditor/ckeditor.js" type="text/javascript"></script>



<style>
    .slimScrollDiv, #lstCategory{width: 100% !important;}
    .checkbox label {margin-left: 5px;}
    .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {margin-left: -5px;}
</style>

<div id="page-content" class="block">
    <div class="block-header">
        <a href="javascript:void(0)" class="header-title-link">
            <h1><%=pageTitle %></h1>
        </a>
    </div>
    <div class="row gutter30">
        <div class="col-sm-7">
            <div class="form-group">
                <div class="help-block" id="help-block-CKDetail"></div>
                <CKEditor:CKEditorControl ID="CKDetail" runat="server" Height="500"></CKEditor:CKEditorControl>
            </div>
        </div>
        <div class="col-sm-5">
            <ul class="nav nav-tabs push" data-toggle="tabs" id="lstBtnNavigator">
                <li class="active" id="liInfo"><a href="#tabs-info">Thông tin cơ bản</a></li>
                <li class="" id="liDesc"><a href="#tabs-desc">Mô tả</a></li>
                <li class="" id="liAdvance"><a href="#tabs-advance">Mở rộng</a></li>
            </ul>
            <div class="tab-content" id="lstTabContent">
                <div class="tab-pane active" id="tabs-info">
                    <div class="form-horizontal">
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tiêu đề</label>
                            <div class="col-md-8">
                                <input type="text" id="txtTitle" class="form-control" placeholder="" value='<%=Server.HtmlEncode(obj.NewTitle)%>'>
                                <div class="help-block"></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tác giả</label>
                            <div class="col-md-8">
                                <input type="text" id="txtAuthor" class="form-control" placeholder="" value="<%=obj.NewAuthor %>">
                                <div class="help-block"></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Xuất bản lúc:</label>
                            <div class="col-md-8">
                                <div class="col-md-6" style="padding-left: 0px;">
                                    <input type="text" id="txtDate" class="form-control input-datepicker-close text-center" data-date-format="dd/mm/yyyy" placeholder="dd/mm/yyyy" value="<%=currDate %>">
                                </div>
                                <div class="col-md-6">
                                    <div class="input-group bootstrap-timepicker">
                                        <input type="text" id="txtTime" name="example-timepicker24" class="form-control input-timepicker24 text-center" readonly="readonly" value="<%=currTime %>">
                                        <span class="input-group-btn">
                                            <a href="javascript:void(0)" class="btn btn-default" style="padding: 9px 12px;"><i class="fa fa-clock-o"></i></a>
                                        </span>
                                    </div>
                                </div>
                                <div class="help-block"></div>                                
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Ảnh đại diện</label>
                            <div class="col-md-8">
                                <div style="float: left;width: 100%;margin-bottom: 10px;">
                                    <input id="file_upload" name="file_upload" type="file" multiple="true">
                                </div>
                                <span class="input-group-addon">
                                    <img id="avatar" src="<%=avatar %>" height="100" style="">
                                </span>
                                <input type="hidden" name="hdAvatar" id="hdAvatar" value="<%=obj.NewImage %>">
                                <div class="help-block"></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Danh mục</label>
                            <div class="col-md-8">
                                <input type="hidden" id="hidUpdateListOn" value="0" />
                                <input type="hidden" id="hidCateId" value="<%=obj.CatId %>" />
                                <input type="hidden" id="hidCateParentListOn" value="<%=strParentListOn %>" />
                                <input type="hidden" id="hidCateChildListOn" value="<%=strChildListOn %>" />
                                <div id="lstCategory">
                                <asp:Repeater ID="rptParentCate" runat="server">
                                    <ItemTemplate>
                                        <div class="checkbox">
                                            <label for="chkListon_<%# Eval("CatId")%>" data-toggle="tooltip" data-original-title="Chọn để hiển thị tin tức trên danh mục này.">
                                                <input type="checkbox" id="chkListon_<%# Eval("CatId")%>" 
                                                        name="chkParent" value="<%# Eval("CatName")%>" 
                                                        cateid='<%# Eval("CatId")%>' 
                                                        parent='<%# Eval("CatParentId")%>'> 
                                                <%# Eval("CatName")%>
                                            </label>
                                        </div>
                                        <asp:Repeater ID="rptChildCate" runat="server">
                                            <ItemTemplate>
                                                <div class="checkbox ml30 chk_childCate">
                                                    <label for="chkListon_<%# Eval("CatId")%>" data-toggle="tooltip" data-placement="top" data-original-title="Chọn để hiển thị tin tức trên danh mục này.">
                                                        <input type="checkbox" id="chkListon_<%# Eval("CatId")%>" 
                                                            name="chkChild" value="<%# Eval("CatName")%>" 
                                                            cateid='<%# Eval("CatId")%>' 
                                                            parent='<%# Eval("CatParentId")%>'> 
                                                        <%# Eval("CatName")%>
                                                    </label>
                                                    <button type="button" class="btn btn-xs btn-default btn-sx btn-success" style="" data-toggle="tooltip" data-placement="right" data-original-title="Chọn danh mục chính của tin tức." onclick="choseMainCate(this, <%# Eval("CatId")%>, <%# Eval("CatParentId")%>)"><i class="fa fa-check fa-fw"></i>Danh mục chính</button>
                                                </div>  
                                            </ItemTemplate>
                                        </asp:Repeater>
                                    </ItemTemplate>
                                </asp:Repeater>
                                </div>
                                <div class="help-block" id="help-block-lstCategory"></div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Trạng thái</label>
                            <div class="col-md-8">
                                <asp:DropDownList ID="ddlStt" runat="server" CssClass="form-control form-control-status" size="1"></asp:DropDownList>
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane" id="tabs-desc">
                    <div class="form-horizontal">
                        <div class="form-group" style="margin: 0px;">
                            <div class="col-md-12">
                                <textarea id="txtDesc" rows="10" class="form-control" placeholder="Mô tả..."><%=obj.NewDesc %></textarea>
                                <div class="help-block"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="tab-pane" id="tabs-advance">
                    <div class="form-horizontal">
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tin HOT &nbsp; <i class="gi gi-fire text-danger"></i></label>
                            <div class="col-md-8">
                                <label class="switch switch-success-custom"><input id="chkHot" rel='' type="checkbox" <%=obj.ChkHot %>><span></span></label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tin TOP &nbsp; <i class="hi hi-star text-primary"></i></label>
                            <div class="col-md-8">
                                <label class="switch switch-success-custom"><input id="chkTop" rel='' type="checkbox" <%=obj.ChkTop %>><span></span></label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tin Video &nbsp; <i class="gi gi-film text-info"></i></label>
                            <div class="col-md-8">
                                <label class="switch switch-success-custom"><input id="chkVideo" rel='' type="checkbox" <%=obj.ChkVideo %>><span></span></label>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-3 control-label" for="example-text-input">Tin Ảnh &nbsp; <i class="gi gi-picture text-info"></i>
                            </label>
                            <div class="col-md-8">
                                <label class="switch switch-success-custom"><input id="chkPhoto" rel='' type="checkbox" <%=obj.ChkPhoto %>><span></span></label>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="form-group text-center mt50">
                    <button type="button" id="btnUpdate" class="btn btn-sm btn-success"><i class="hi hi-plus mr5"></i><%=btnSubmitText%></button>
                    <a href="/BackEnd/?ui=20" id="btnBack" class="btn btn-sm btn-primary"><i class="hi hi-arrow-left mr5"></i>Quản lý tin</a>
                </div>
            </div>
        </div>
    </div>
</div>

<script>

    $("#btnUpdate").bind("click", function () {
        var isHot, isTop, isVideo, isPhoto;
        isHot = isTop = isVideo = isPhoto = 0;
        // check ckeditor null data
        var ckDetail = CKEDITOR.instances.<%=CKDetail.ClientID %>;
        if(ckDetail.getData().trim() == '') {
            validErrorCKEditor('help-block-CKDetail', 'Chi tiết tin không được để trống.');
            ckDetail.focus();
            return false;
        }else {
            validSuccessCKEditor('help-block-CKDetail');
        }

        if (!chkTextBox('txtTitle', 'Bạn phải nhập Tiêu đề tin...')) return false;
        if (!chkTextBox('hdAvatar', 'Bạn phải Upload Ảnh Đại Diện...')) {
            
            return false;   
        }
        
        if(($('#hidCateId').val().trim() == '') || $('#hidCateId').val().trim() == '0') {
            validErrorCKEditor('help-block-lstCategory', 'Bạn chưa thiết lập Danh Mục Chính cho tin bài...');
            return false;
        }else {
            validSuccessCKEditor('help-block-lstCategory');
        }
        
        // check Gioi thieu xem nhap chua, va active Tab Gioi Thieu
        if (!chkTextBox('txtDesc', 'Bạn phải nhập Mô tả tin bài...')) {
            // active Tab giới Thiệu
            $('#lstBtnNavigator').find('li').removeClass('active');
            $('#lstTabContent').find('div.tab-pane').removeClass('active');
            $('#tabs-desc').addClass('active');
            $('#liDesc').addClass('active');
            return false;   
        }
        
        // lay gia tri check box Mo rong
        if ($('#chkHot').is(':checked')) isHot = 1;
        if ($('#chkTop').is(':checked')) isTop = 1;
        if ($('#chkVideo').is(':checked')) isVideo = 1;
        if ($('#chkPhoto').is(':checked')) isPhoto = 1;
        
        
        //var data = CKDetail.instances.tBody.getData();
        //console.log(data);
        // call ajax
        var param;
        param = {
            m: "add",
            ui : <%=panelId %>,
            id: <%=id %>,
            detail1: ckDetail.getData().trim(),
            title: $('#txtTitle').val(),
            author: $('#txtAuthor').val(),
            date: $('#txtDate').val(),
            time: $('#txtTime').val(),
            avatar: $('#hdAvatar').val(),
            cateid: $('#hidCateId').val(),
            listonchild: $('#hidCateChildListOn').val(),
            listonparent: $('#hidCateParentListOn').val(),
            stt: $('#<%=ddlStt.ClientID %>').val(),
            desc: $('#txtDesc').val(),
            ishot: isHot,
            istop: isTop,
            isvideo: isVideo,
            isphoto: isPhoto,
            isUpdateListon: $('#hidUpdateListOn').val()
        };
        //console.log(param);return;
        
        $.ajax({
            url: "/BackEnd/Handler/News.ashx",
            data: param,
            type: "POST",
            dataType: "json",
            beforeSend: function () {
                jWaiting.callWaiting();
            },
            success: function (data) {
                //console.log(data);
                if (data.Success) {
                    if (param.id > 0)
                        jWaiting.callWaitingMessSuccess('Thay đổi nội dung tin bài thành công...', 'reload', true);
                    else
                        jWaiting.callWaitingMessSuccess('Thêm mới tin bài thành công...', '/BackEnd/?ui=20', true);
                }
                else {
                    jWaiting.callWaitingMessError('Có lỗi: ' + data.Message);
                }
            }
        });
        
    });

    $(function () {

        // format color for drop down list
        FormatColorDropList('<%=ddlStt.ClientID %>');

        /*$("#modal-compose").on("shown.bs.modal", function () {
        $(".modal-select-chosen").chosen({ width: "100%" })
        }), */
        $("#lstCategory").slimScroll({
            height: 200,
            color: "#000000",
            size: "3px",
            width: "60%",
            touchScrollStep: 0
        });

        $("#lstCategory").find("input:checkbox").each(function () {
            var $this = $(this);
            $this.change(function () {
                //console.log('change checkbox');
                if ($this.is(':checked')) {
                    //console.log('id: ' + $this.attr("cateid") + '-- parent: ' + $this.attr("parent") + '-- name: ' + $this.attr("name") + ' -- checked');  // checked
                    if ($this.attr("parent") > 0) {// neu check box child dc check thi check luon check box parent
                        $('#chkListon_' + $this.attr("parent")).prop('checked', true);
                    }
                    setValToListon($this.attr("cateid"), $this.attr("parent"));
                }
                else {
                    //console.log('id: ' + $this.attr("cateid") + '-- parent: ' + $this.attr("parent") + '-- name: ' + $this.attr("name") + ' -- uncheck');  // unchecked
                    removeValToListon($this.attr("cateid"), $this.attr("parent"));
                }
            });
        });

        
    });

    // Uploadify
    $(function () {
        $('#file_upload').uploadify({
            'formData': {
                'timestamp': '',
                'token': ''
            },
            'fileTypeDesc': 'Image Files',
            'fileTypeExts': '*.gif; *.jpg; *.png',
            'multi': false,
            'buttonImage': '/BackEnd/img/browse-btn.png',
            'successTimeout': 300,
            'swf': '/BackEnd/js/uploadify.swf',
            'uploader': "/BackEnd/Handler/UploadImage.ashx?m=uploadavatarnew",
            'onUploadStart': function (file, data, response) {
                //$('#tvcStt').fadeIn('fast');
                //console.log('start');
            },
            'onUploadSuccess': function (file, data, response) {
                console.log(data);
                var obj = JSON.parse(data);
                if (obj.Success == true) {
                    $('#hdAvatar').val(obj.Data);
                    $('#avatar').attr('src', obj.ExtData);
                } else {
                    jWaiting.callWaitingMessError('Có lỗi xảy ra trong quá trình Upload, hãy F5 rồi thử lại....', '');
                }
            }
        });
    });    
    
    
</script>

<script>


    loadListOn();
    function loadListOn() {
        var cate = $('#hidCateId').val();
        var lstParent = $('#hidCateParentListOn').val();
        var lstChild = $('#hidCateChildListOn').val();

        if (cate > 0) {
            $('#chkListon_' + cate).prop("checked", true);
            // hightlight checkbox
            $('#chkListon_' + cate).parent().parent().addClass('active');
        }
        lstParent = lstParent + "," + lstChild;
        var arrListOn = new Array();
        arrListOn = lstParent.split(",");
        for (i in arrListOn) {
            if (arrListOn[i] > 0) $('#chkListon_' + arrListOn[i]).prop("checked", true);
        }


    }
</script>

